"use strict"
const mobileMenuButton = document.querySelector(".mobile-menu-button")
const mainMenu = document.querySelector(".main-menu")
const topBurger = document.getElementsByClassName("burger")[0]
const midleBurger = document.getElementsByClassName("burger")[1]
const bottomBurger = document.getElementsByClassName("burger")[2]

const showMenu = () => {
    mainMenu.classList.toggle("main-menu-show")
    topBurger.classList.toggle('top-burger')
    midleBurger.classList.toggle('midle-burger')
    bottomBurger.classList.toggle('bottom-burger')
    mainMenu.classList.add("transition")
    setTimeout(() => {
        mainMenu.classList.remove("transition")
    }, 300)
}

mobileMenuButton.addEventListener("click", showMenu)